.status-tag {
  @include flex-inline-flex;
  width: 56px;
  height: 20px;
  border-radius: 2px;
  font-size: 12px;
  line-height: 20px;
  &--warning {
    background: #fff0d9;
    border: 1px solid #ffffff;
    color: #ff9900;
  }
}

// 底部按钮
.buttons {
  @include flex-center;
  padding-top: 26px;
  margin-bottom: 26px;
  .cancel-button {
    width: 92px;
    height: 36px;
    border: 0;
    background-color: #f2f3f5;
  }
  .confirm-button {
    width: 92px;
    height: 36px;
    margin-left: 16px;
  }
}

// 消息列表
.approve-msg {
  width: max(461px,100%);
  &__list {
    @include flex-column;
    width: 100%;
    padding: 18px 0 0 20px;
    &__tabs {
      @include flex-between;
      margin-bottom: 12px;
      padding-right: 20px;
      .check-more {
        @include flex-align;
        cursor: pointer;
        &__label {
          font-weight: 400;
          font-size: 14px;
          color: #409eff;
          line-height: 24px;
        }
      }
    }
    div:nth-child(1) ~ div {
      margin-left: -1px;
    }
    .tabs-item {
      @include flex-inline-flex;
      width: 74px;
      height: 30px;
      border: 1px solid #dcdcdc;
      cursor: pointer;
      &:first-child {
        border-radius: 3px 0 0 3px;
      }
      &:last-child {
        border-radius: 0 3px 3px 0;
      }
    }
    .tabs-item--active {
      color: #007dff;
      border-color: #007dff;
      position: relative;
      z-index: 2;
    }
  }
  &__items {
    flex:1;
    position: relative;
    padding-right: 20px;
    .msg-item {
      padding: 4px 10px;
      box-sizing: border-box;
      background-color: #f5f7fa;
      border-radius: 4px;
      cursor: pointer;
      & + .msg-item {
        margin-top: 4px;
      }
      &__title {
        @include flex-between;
        align-items: center;
        &__label {
          font-size: 14px;
          color: #3d3d3d;
          line-height: 20px;
        }
      }
      &__user {
        @include flex-between;
        align-items: center;
        &__label {
          padding-left: 9px;
          font-size: 12px;
          color: #989ea8;
          line-height: 17px;
        }
        &__tip {
          font-size: 10px;
          color: #ff9900;
          line-height: 14px;
        }
      }
    }
    :deep(.arco-empty) {
      @include position-center;
    }
  }
}

// 消息确认弹窗
.msg-body {
  @include flex-column;
  height: 100%;
  overflow: hidden;
  &__title {
    @include flex-between;
    align-items: center;
    padding: 25px 20px 10px;
    border-bottom: 1px solid #dcdfe6;
    :deep(.arco-icon) {
      font-size: 24px;
      color: #86909c;
    }
  }
  &__content {
    position: relative;
    flex: 1;
    overflow-y: auto;
    padding: 10px 20px 26px;
    box-sizing: border-box;
    .message-promoter {
      @include flex-between;
      align-items: center;
      padding: 9px 0 11px;
      border-bottom: 1px solid #dcdfe6;
      .user-name {
        font-size: 14px;
        font-weight: bold;
        color: #3d3d3d;
        line-height: 20px;
      }
      .confirm-status {
        font-size: 10px;
        color: #ff9900;
        line-height: 14px;
        &--read {
          font-size: 14px;
          color: #606266;
          line-height: 20px;
        }
        &--refuse,
        &--confirm {
          position: absolute;
          right: 20px;
          top: 0;
        }
      }
    }
    .confirm-file {
      margin-top: 10px;
      background-color: #f6f8fa;
      &__upload {
        @include flex-center;
        flex-direction: column;
        padding: 25px 0 24px;
        box-sizing: border-box;
        margin: 0 16px;
        border-bottom: 1px solid #e1e6ed;
      }
      &__button {
        @include flex-align;
        .upload-button {
          margin-right: 10px;
          font-size: 14px;
          color: #007dff;
          line-height: 24px;
        }
        :deep(.svg-icon) {
          margin-right: 10px;
        }
      }
      &__tip {
        font-size: 12px;
        color: #86909c;
        line-height: 22px;
      }
      .refused-reason{
        margin: 0 16px;
        border-bottom: 1px solid #e1e6ed;
        &__label{
          padding: 16px 0 10px;
          font-size: 12px;
          color: #1A1A1A;
          line-height: 17px;
        }
        &__content{
          padding-bottom: 18px;
          font-size: 12px;
          color: #3D3D3D;
          line-height: 17px;
        }
      }
    }
  }
}
.message-drawer {
  :deep(.arco-drawer-body) {
    @include flex-column;
    padding: 0;
  }
}


